<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/testrunner.js"></script>
<script type="text/javascript" src="../jscripts/tiny_mce/classes/adapter/jquery/jquery.tinymce.js"></script>
<link rel="stylesheet" href="css/unit.css" type="text/css" />
<script>
test("Get contents using jQuery", function() {
	expect(4);

	tinyMCE.get('elm1').setContent('<p>Editor 1</p>');

	equals($('#elm1').html(), '<p>Editor 1</p>');
	equals($('#elm1').val(), '<p>Editor 1</p>');
	equals($('#elm1').attr('value'), '<p>Editor 1</p>');
	equals($('#elm1').text(), 'Editor 1');
});

test("Set contents using jQuery", function() {
	expect(4);

	$('#elm1').html('Test 1');
	equals($('#elm1').html(), '<p>Test 1</p>');

	$('#elm1').val('Test 2');
	equals($('#elm1').html(), '<p>Test 2</p>');

	$('#elm1').text('Test 3');
	equals($('#elm1').html(), '<p>Test 3</p>');

	$('#elm1').attr('value', 'Test 4');
	equals($('#elm1').html(), '<p>Test 4</p>');
});

test("append/prepend contents using jQuery", function() {
	expect(2);

	tinyMCE.get('elm1').setContent('<p>Editor 1</p>');

	$('#elm1').append('<p>Test 1</p>');
	equals($('#elm1').html(), '<p>Editor 1</p>\n<p>Test 1</p>');

	$('#elm1').prepend('<p>Test 2</p>');
	equals($('#elm1').html(), '<p>Test 2</p>\n<p>Editor 1</p>\n<p>Test 1</p>');
});

test("Find using :tinymce selector", function() {
	expect(1);

	equals($('textarea:tinymce').length, 2);
});

test("Set contents using :tinymce selector", function() {
	expect(3);

	$('textarea:tinymce').val('Test 1');
	equals($('#elm1').val(), '<p>Test 1</p>');
	equals($('#elm2').val(), '<p>Test 1</p>');
	equals($('#elm3').val(), 'Textarea');
});

test("Get contents using :tinymce selector", function() {
	expect(1);

	$('textarea:tinymce').val('Test get');
	equals($('textarea:tinymce').val(), '<p>Test get</p>');
});

$().ready(function() {
	$('textarea.tinymce').tinymce({
		// Location of TinyMCE script
		script_url : '../jscripts/tiny_mce/tiny_mce.js',

		// General options
		theme : "advanced",
		plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",

		// Theme options
		theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
		theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
		theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
		theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
		theme_advanced_toolbar_location : "top",
		theme_advanced_toolbar_align : "left",
		theme_advanced_statusbar_location : "bottom",
		theme_advanced_resizing : true,

		// Example content CSS (should be your site CSS)
		content_css : "css/content.css",
		init_instance_callback : function(ed) {
			// When both editors are initi
			if (tinyMCE.get('elm1').initialized && tinyMCE.get('elm2').initialized)
				run();
		}
	});
});
</script>
</head>
<body>
	<h1>TinyMCE jQuery plugin tests</h1>
	<h2 id="banner"></h2>
	<h2 id="userAgent"></h2>
	<ol id="tests"></ol>
	<div id="main"></div>
	<div id="content">
		<textarea id="elm1" name="elm1" class="tinymce">Editor 1</textarea>
		<textarea id="elm2" name="elm2" class="tinymce">Editor 2</textarea>
		<textarea id="elm3" name="elm3">Textarea</textarea>
	</div>
</body>
</html>
